import styled from 'styled-components'
export const PlaylistInfoWrapper = styled.div`

  display:flex;
  .left{
    .mask{
      position:absolute;
      width: 208px;
      height:208px;
      background-position: 0 -1285px
    }
  }
  .right{
    margin-left:20px;
    .title{
      display: flex;
      .playlist_icon{
        display: inline-block;
        width: 54px;
        height: 24px;
        background-position: 0 -243px;
      }
      .name{
        color:#333;
        margin-left:10px;
        line-height: 24px;
        font-size: 20px;
        font-weight: normal;
      }
    }
    .create_info{
      margin-top:20px;
      margin-bottom:20px;
      display: flex;
      .creator_img{
        cursor:pointer;
      }
      .creator_name{
        margin-left:10px;
        display: flex;
        align-items:center;
        color:#0C73C2;
        cursor:pointer;

      }
      .iden_icon{
        width:13px;
        height:13px;
        margin-top:10px;
      }
      .create_time{
        display: flex;
        align-items:center;
        color:#999;
        margin-left:20px;
      }
    }
    .tag_info{
      margin-top:20px;
      display: flex;
      .tags{
        display: flex;
        .tag{
          color:#777;
          border-radius:10px;
          border:1px solid #ccc;
          text-align:center;
          padding:0 8px;
          background-color:rgb(247,247,247);
          margin-left:5px;
        }
      }
    }
    .introduce{
      margin-top:10px;
    }
  }
`
